<%@ include file="/taglibs.jsp" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.util.*" %>

<head>
	<title>北京邮电大学学生党员在线学习中心</title>
	<link type="text/css" rel="stylesheet" href="${ctx}/css/jquery-ui-1.8.16.custom.css" />
	<link href="${ctx}/css/pagination.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="${ctx}/scripts/jquery-ui-1.8.16.custom.min.js"></script>
	<script type="text/javascript" src="${ctx}/scripts/jquery.ui.core.js"></script>
	<script type="text/javascript">
		function openVideo(obj, categoryId){
			openwindow("${ctx}/AdminVideoAction_playVideo?videopath=" + obj + "&categoryId=" + categoryId, "视频播放",440,370);
		}
	
		function openwindow(url,name,iWidth,iHeight){
			var url; //转向网页的地址;
			var name; //网页名称，可为空;
			var iWidth; //弹出窗口的宽度;
			var iHeight; //弹出窗口的高度;
			var iTop = (window.screen.availHeight-30-iHeight)/2; //获得窗口的垂直位置;
			var iLeft = (window.screen.availWidth-10-iWidth)/2; //获得窗口的水平位置;
			window.open(url,name,'height='+iHeight+',,innerHeight='+iHeight+',width='+iWidth+',innerWidth='+iWidth+',top='+iTop+',left='+iLeft+',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no');
		}
		
		function openViewDemo(obj){
			window.open("${ctx}/AdminVideoAction_viewDemo?videopath=" + obj , "查看视频信息", "top=0,left=0,toolbar=no,menubar=no,scrollbars=yes,fullscreen=yes");
		}
		
		function openDialog(dialog_id, videoPath, updateDate, status, videoCategoryId, name, picPath, introduction){
			if(dialog_id == 'edit_video_info'){
				clear();
				$('#videoPath').text(videoPath);
				$('#videoId').val(videoPath);
				$('#videoUploadTime').text(updateDate);
				$('#videoStatus1').val(status);
				
				//$('#videoCategoryId').text(videoCategoryId);
				$('#videoName').val(name);
				$('#videoIntroduction').val(introduction);
				
				$.ajax({
	 				url:"${ctx}/AdminVideoAction_convertCategory?categoryId=" + videoCategoryId + "&rand=" + Math.random(),
	 				type:"post",
	 				timeout:3000,
	 				success:function(data){
	 					$('#videoCategoryId').text(data);
	 				}
	 			});
				
				$("#edit_video_info").dialog({
		 	 		width:650, 
		 	 		height:'auto', 
		 	 		maxHeight:160,
		 	 		modal: true
		 	 	});
			}
			return false;
		}
		
		function clear(){
			$('#videoPath').text('');
			$('#videoUploadTime').text('');
			$('#videoStatus1').val('');
			
			$('#videoCategoryId').val('');
			$('#videoName').val('');
			$('#videoIntroduction').val('');
		}
		
		function changeStatus(status){
			if(status=='none')
				window.location.replace("${ctx}/AdminVideoAction_edit");
			else
				window.location.replace("${ctx}/AdminVideoAction_edit?status=" + status);
			return false;
		}
		
		$(document).ready(function() {
			$(".video-list-table tr:even").css("background", "#fdf3bf");
			$(".video-list-table tr:odd").css("background", "#ffffff"); 
		});
	</script>
</head>

<div id="nav_bar">
    <img id="nav_bar_left" src="${ctx}/styles/nav_bar_left.png" alt=""/>
    <div id="welcome_label">欢迎您，&nbsp;<s:property value="#session.session_user.adminName" />!</div>
    <img id="nav_bar_seperator" src="${ctx}/styles/nav_bar_seperator.png" alt=""/>
    <div id="nav_location">
        <img id="nav_bar_point" src="${ctx}/styles/nav_bar_point.png" alt="" />
        <div id="nav_cur_location">当前位置：&nbsp;<a href="${ctx}/AdminVideoAction_view">影视精品管理</a>&nbsp;&nbsp;>&nbsp;&nbsp;<span style="color:black;">编辑视频文件</span></div>
    </div>
    <img style="float:right; width:5px;" src="${ctx}/styles/nav_bar_right.png" alt=""/>
    <a id="nav_logout" href="${ctx}/logoutAction_adminLogout">[安全退出]</a>
</div>
<div style="clear:both; height:5px;">&nbsp;</div>

<div style="min-height:450px;">
	<!-- left -->
	<div id="side_menu" style="min-height:700px;">
	    <div id="side_menu_title">
	        <img src="${ctx}/styles/side_menu_title_img.png" alt="" />
	        <span>影视精品管理</span>
	    </div>
	    <div id="side_menu_title_bottom">&nbsp;</div>
	    <div class="side_sub_menu">
	        <div class="side_menu_point">&nbsp;</div>
	        <a href="${ctx}/AdminVideoAction_view">上传视频文件</a>
	    </div>
	    <div class="side_menu_seperator">&nbsp;</div>
	    <div class="side_sub_menu_focus">
	        <div class="side_menu_point">&nbsp;</div>
	        <a href="${ctx}/AdminVideoAction_edit">编辑视频文件</a>
	    </div>
	</div>
	
	<div id="main_content">
	    <div id="main_content_title">
	        <img src="${ctx}/styles/content_title_img.png" alt="" />
	        <span>编辑视频文件</span>
	    </div>
	    <div class="main_content_title_bottom">&nbsp;</div>
	    <form id="displayVideoForm" name="displayVideoForm" action="${ctx}/AdminVideoAction_edit" method="POST">
		<input name="actionType" type="hidden" value="displayVideoInfo" />
		<input id="selectedVideoPaths" name="selectedVideoPaths" type="hidden" value="" />
		<input id="pageNow" name="pageNow" type="hidden" value="<s:property value='pageNow' />" />
		<input id="status" name="status" type="hidden" value="<s:property value='status' />" />
		
		<div style=" height:25px;">
			<img alt="" src="${ctx}/styles/to_list_img.png" style="float:left; margin-left:10px; margin-top:7px;">
			<input type="radio" name="selectedStatus" checked="checked" style="margin-left:5px;" onclick="changeStatus('none')">所有</input>
			<s:if test="#request.status == 0"><input type="radio" name="selectedStatus" checked="checked"style="margin-left:10px;">未编辑</input></s:if>
			<s:else><input type="radio" name="selectedStatus"style="margin-left:10px;" onclick="changeStatus(0)">未编辑</input>	</s:else>
			<s:if test="#request.status == 1"><input type="radio" name="selectedStatus" checked="checked" style="margin-left:10px;">已编辑,未发布</input></s:if>
			<s:else><input type="radio" name="selectedStatus" style="margin-left:10px;" onclick="changeStatus(1)">已编辑,未发布</input>	</s:else>
			<s:if test="#request.status == 2"><input type="radio" name="selectedStatus" checked="checked" style="margin-left:10px;">已发布</input></s:if>
			<s:else><input type="radio" name="selectedStatus" style="margin-left:10px;" onclick="changeStatus(2)">已发布</input></s:else>
			<input type="button"  onclick="window.location.href='${ctx}/AdminVideoAction_edit?reload=1'" class="input-button" value="重新加载视频文件" style="margin-left:260px;" />
		</div>
		
		
		
		<table id="newsListTable" class="video-list-table" cellspacing="0" cellpadding="0" style="width:730px; float:left; margin-left:10px; margin-top:5px;">
		<s:if test="#request.videoList == null || #request.videoList.size == 0">
			<div style="clear:both; height:10px;">&nbsp;</div>
			<div style="text-align:center;">
				<span style=" font-size:14px; color:#ce3a00; font-weight:bold; ">对不起，没有对应该类别的视频!</span>
			</div>
		</s:if>
		<tr>
			<th style="width:40px;">选择</th>
			<th style="width:155px;">封面图片</th>
			<th style="width:360px;">视频简介</th>
			<th style="width:60px;">状态</th>
			<th style="width:80px;">操作</th>
		</tr>
		<s:iterator value="#request.videoList">
		<tr>
			<td><input type="checkbox" name="selectedVideos" id="select_<s:property value='videopath'/>"/></td>
			<td style="width:155px; height:102px; padding:5px; position:relative; display:block;">
				<img style="position:relative; width:147px; height:102px; cursor:pointer; border:solid 1px #cccccc;" src="${ctx }<s:property value='picPath' />" />
				<s:if test="status == 2">
					 <img src="${ctx}/styles/video_player_layer.png" alt="" onclick="openVideo('<s:property value='videopath' />', '<s:property value='props.categoryId' />')" style="position:absolute; top:0; left:0; width:145px; height:100px; cursor:pointer;"/>
				</s:if>
			</td>
			<td style="text-align:left;" valign="top">
				<span style=" font-size:14px; color:#ce3a00; font-weight:bold; ">
				<s:if test="name != null">
					<s:property value='name' />
				</s:if>
				<s:else>
					<s:property value="videopath"/>
				</s:else>	
				</span>
				&nbsp;&nbsp;&nbsp;&nbsp;<s:property value="props.uploadDate"/>
				<br/>
				<span><s:property value='introduction'/></span>
			</td>
			<td style="text-align:center; width:60px;" valign="middle">
				<s:if test="status != 1">
					<s:property value='statusInText' />
				</s:if>
				<s:else>
					已编辑,<br/>未发布
				</s:else>
			</td>
			<td style="width:80px; text-align: center;">
				<a href="#" onclick="return openDialog('edit_video_info', '<s:property value='videopath'/>', '<s:property value='props.uploadDate'/>', '<s:property value='status'/>', '<s:property value='props.categoryId'/>', '<s:property value='name'/>', '<s:property value='picPath'/>', '<s:property value='props.introduction'/>')">编辑</a>
				<s:if test="status == 2">
						&nbsp;&nbsp;
						<a href="#" onclick="return openViewDemo('<s:property value='videopath'/>')">查看</a>
				</s:if>
			</td>
		</tr>
		</s:iterator>
		</table>
		<div style="clear:both; height:10px;"></div>
		<div style="margin-left:0; text-align: center;">
			<s:property value="paginationCode" escape="false"/>
		</div>
		</form>
		<script type="text/javascript">
			function swapIndex(){
	 			//var cbs = $("input[type='checkbox'][name='selectedVideos'][:checked]");
	 			var cbs = $(":checked[name='selectedVideos']");
				if(cbs.length != 2){
					alert("请选择两个视频文件!");
					return false;
				}
				var index = 0;
				var selectedVideoPaths = "";
				for(; index < cbs.length; index = index + 1){
					var str = $(cbs[index]).attr('id');
					selectedVideoPaths = selectedVideoPaths + "#" + str.substr(7);
				}
				$("#selectedVideoPaths").val("swap" + selectedVideoPaths);
				$("#actionType").val("displayVideoInfo");
				$('#displayVideoForm').submit();
			}
			
			function upOneIndex(){
				var cbs = $(":checked[name='selectedVideos']");
				if(cbs.length != 1){
					alert("请选择一个文件");
					return false;
				}
				var str = $(cbs[0]).attr('id');
				$("#selectedVideoPaths").val("upup#" + str.substr(7));
				$("#actionType").val("displayVideoInfo");
				$('#displayVideoForm').submit();
			}
			
			function downOneIndex(){
				var cbs = $(":checked[name='selectedVideos']");
				if(cbs.length != 1){
					alert("请选择一个文件");
					return false;
				}
				var str = $(cbs[0]).attr('id');
				$("#selectedVideoPaths").val("down#" + str.substr(7));
				$('#displayVideoForm').submit();
			}
			
			// Add the status into the link
			$(function(){
				var status = $("#status").val();
				if(status != null && status.length == 1){
					var alinks = $("a:[href^='/AdminVideoAction_edit?pageNow']");
					var index = 0;
					for(; index < alinks.length; index = index + 1){
						$(alinks[index]).attr("href", $(alinks[index]).attr("href") + "&status=" + status);
					}
				}
			});
		</script>
		<div style="clear:both; float:left; margin-top:5px;">
			<input id="swapIndex" name="swapIndex" type="button" class="input-button" value="交换位次" onclick="return swapIndex()"/>
			<input id="swapIndex" name="swapIndex" type="button" class="input-button" value="上升一位" onclick="return upOneIndex()"/>
			<input id="swapIndex" name="swapIndex" type="button" class="input-button" value="下降一位" onclick="return downOneIndex()"/>
		</div>
	</div>
</div>


<div id="contentDiv">
	
	
</div>
<div style="clear:both;"></div>
<div id="edit_video_info" name="edit_video_info" title="编辑视频信息" style="display:none; width:100%; width:550px; height:300px;">
<form id="modifyVideoForm" name="modifyVideoForm" action="${ctx}/AdminVideoAction_edit" method="POST" enctype="multipart/form-data">
<input id="actionType" name="actionType" type="hidden" value="modifyVideoInfo" />
<input id="videoId" name="videoId" type="hidden" />
<input id="pageNow" name="pageNow" type="hidden" value="<s:property value='pageNow' />" />
<input id="status" name="status" type="hidden" value="<s:property value='status' />" />
<table class="page_table" cellspacing="0" cellpadding="0" style="width:100%; float:left;">
	<tr>
		<td class="leftTD">视频名称：</td>
		<td class="rightTD"><label id="videoPath">/ddddddd.mp4</label></td>
		<td class="leftTD">上传时间：</td>
		<td class="rightTD"><label id="videoUploadTime">dfhuehfeufhuef</label></td>
	</tr>
	<tr>
		<td class="leftTD2">当前状态：</td>
		<td class="rightTD">
			
			<select id="videoStatus1" name="videoStatus1">
				<option value="1">未发布</option>
				<option value="2">已发布</option>
			</select>
		</td>
		<td class="leftTD2"></td>
		<td class="rightTD"></td>
	</tr>
	<tr>
		<td class="leftTD">视频类别：</td>
		<td class="rightTD">
			<label id="videoCategoryId">/ddddddd.mp4</label>
		</td>
		<td class="leftTD">显示名称：</td>
		<td class="rightTD"><input id="videoName" name="videoName" type="input"/></td>
	</tr>
	<tr>
		<td class="leftTD2">视频图片：</td>
		<td class="rightTD" colspan="3"><input id="videoPic" type="file" name="videoPic"></td>
	</tr>
	<tr>
		<td class="leftTD">视频介绍：</td>
		<td class="rightTD" colspan="3">
			<textarea id="videoIntroduction" rows="5" style="width:95%;" name="videoIntroduction"></textarea>
		</td>
	</tr>
</table>
<div style="clear:both; height:5px;"></div>
<input id="submitBtn" name="submitBtn" type="submit" value="提交" class="input-submit"></input>
</form>
</div>